<?php
include("header.html")
?>
<style type="text/css" media="all"> @import "slider.css"; </style>
	<script src="Javascript/mootools.js" type="text/javascript"></script>
    <script src="Javascript/jquery.js" type="text/javascript" ></script>
    <script src="Javascript/jquery.dimensions.js" type="text/javascript" charset="utf-8"></script>
    <script src="Javascript/ui.mouse.js" type="text/javascript" charset="utf-8"></script>
    <script src="Javascript/ui.slider.js" type="text/javascript" charset="utf-8"></script>


  <script type="text/javascript" charset="utf-8">
        window.onload = function () {
            var container = $('div.sliderGallery');
            var ul = $('ul', container);
            
            var itemsWidth = ul.innerWidth() - container.outerWidth();
            
            $('.slider', container).slider({
                minValue: 0,
                maxValue: itemsWidth,
                handle: '.handle',
                stop: function (event, ui) {
                    ul.animate({'left' : ui.value * -1}, 500);
                },
                slide: function (event, ui) {
                    ul.css('left', ui.value * -1);
                }
            });
        };
    </script>



<body>
    




 <div id="container">   
<div class="content"> 
    <div class ="clothes_rail" align="center">
  	<div class="sliderGallery">
  	<table border="1">
  	<tr width="800px"><img src=images/clothesrail.jpg></tr>
  	<tr>          	
  		<td width="125" align=center><img src=images/Dresses/g_1_1.gif img alt="" width="125" height="182" class="products"
			style="position: relative; z-index: 1000; left: 0px; top: 0px; " ></td>
    	<td width="125" align=center><img src=images/Dresses/g_1_2.jpg alt="Dress" width="125" height="182" class="products"
			style="position: relative; z-index: 1000; left: 0px; top: 0px; "></td>
    	<td width="125" align=center><img src=images/Dresses/g_1_3.jpg alt="Dress" width="125" height="182" class="products"
			style="position: relative; z-index: 1000; left: 0px; top: 0px; "></td>
    	<td width="125" align=center><img src=images/Dresses/g_2_4.jpg alt="Dress" width="90" height="182" class="products"
			style="position: relative; z-index: 1000; left: 0px; top: 0px; "></td>
 	</tr>
  	</table>
           
           <div class="slider">

                <div class="handle"></div>
                <span class="slider-lbl1">Dresses</span>
               
        </div>
</div>
    </div>
    </div>

<div class="widget" align="center"><img src="images/widgetgirlresized.jpg"></div>
  <div class="wish_list"></div>
</div>

<script src="Javascript/widget.js" type="text/javascript"></script>


</body>


<?php
include("Footer.html")
?>